<script setup lang="ts">
import { ref } from 'vue'
import { get } from '@/utils/service'
import RecommendCustomerComponent from '@/components/RecommendCustomerComponent.vue'
const active = ref('-1')
const recommendCustomerView = ref({})
queryMyRecommendCustomerStatic()
function onClickLeft() {
  window.history.back()
}
function onClickTag(obj: object) {
  active.value = obj.name
}
function queryMyRecommendCustomerStatic() {
  get('/recommendCustomerWechatNew/queryMyRecommendCustomerStatic', {}).then((res) => {
    if (res.code == 0) {
      recommendCustomerView.value = res.data
    }
  })
}
function updateDeleteNum(value: object) {
  recommendCustomerView.value = value
}
</script>
<template>
  <van-nav-bar title="我的推荐客户" left-text="返回" left-arrow @click-left="onClickLeft" />
  <div class="myPointDes">
    <div class="myRewardHeader">
      <div style="padding: 12px">
        <h2 style="text-align: left">
          推荐线索:<span>{{ recommendCustomerView.reccommendTotalNum || 0 }}</span
          >条
        </h2>
        <p class="roleRule" style="text-align: left">
          推荐转换率：{{ recommendCustomerView.succesPer || 0.0 }}%
        </p>
      </div>
      <div style="padding: 12px">
        <h2 style="text-align: left">
          推荐成交:<span>{{ recommendCustomerView.reccommendSucccessTotalNum || 0 }}</span
          >条
        </h2>
        <p class="roleRule" style="text-align: right">
          当前排名：{{ recommendCustomerView.currentSortNum || 0 }}
        </p>
      </div>
    </div>
  </div>
  <van-tabs
    v-model:active="active"
    type="card"
    style="width: 100%"
    title-active-color="#FFF"
    color="#c82030"
    title-inactive-color="#c82030"
    @click-tab="onClickTag"
    sticky
  >
    <van-tab title="全部" name="-1">
      <RecommendCustomerComponent
        :active="active"
        :recommendCustomerView="recommendCustomerView"
        @updateDeleteNum="updateDeleteNum"
      ></RecommendCustomerComponent>
    </van-tab>
    <van-tab title="交易中" name="1">
      <RecommendCustomerComponent :active="active"></RecommendCustomerComponent>
    </van-tab>
    <van-tab title="交易成功" name="2">
      <RecommendCustomerComponent :active="active"></RecommendCustomerComponent>
    </van-tab>
    <van-tab title="交易失败" name="3">
      <RecommendCustomerComponent :active="active"></RecommendCustomerComponent>
    </van-tab>
  </van-tabs>

  <br />
</template>
